<template>
  <div class="showDetail">
    <el-dialog :title="$t('exemgt.upload_exe')" :visible.sync="showModal" :uploadModal="uploadModal" @close="$emit('update:uploadModal', false)">
            <SvgLoader v-if="isLoading"></SvgLoader>
      <el-form class="small-space" ref="adjustTypeFrom" label-position="right" label-width="120px">
          <el-form-item :label="$t('exemgt.bankname') + ':'">
                <el-input v-model="exemgtData.bank_name" placeholder="CCB"></el-input>
          </el-form-item>
          <el-form-item :label="$t('exemgt.filename') + ':'">
                <el-input v-model="exemgtData.filename" placeholder="1234506-CCB"></el-input>
          </el-form-item>
          <el-form-item :label="$t('exemgt.version') + ':'">
                <el-input v-model="exemgtData.version" placeholder="1.0.0.1"></el-input>
          </el-form-item>
          <el-form-item :label="$t('exemgt.desc') + ':'">
                <el-input v-model="exemgtData.description" placeholder="EXE Package for CCB 2019-02-14"></el-input>
          </el-form-item>
           <el-form-item :label="$t('exemgt.bankname') + ':'" prop="file">
<el-upload
  class="upload-demo"
  ref="upload"
  :on-change="handleChange"
  :file-list="exemgtData.fileList"
  action=""
  :auto-upload="false">
  <el-button slot="trigger" size="small" type="primary">{{$t('exemgt.select_file')}}</el-button>
  <div class="el-upload__tip" slot="tip">{{$t('exemgt.upload_notif')}}</div>
</el-upload>
    </el-form-item>
      </el-form>
       <span slot="footer" class="dialog-footer">
    <el-button @click="showModal = false">{{$t('exemgt.cancel') }}</el-button>
    <el-button type="primary" @click="handleSubmit">{{$t('exemgt.confirm') }}</el-button>
  </span>
    </el-dialog>
  </div>
</template>
<script>
 import { uploadExe } from '@/api/exemgt'
 import SvgLoader from '@/components/SvgIcon/SvgLoader'
 
 export default {
     components: {
         SvgLoader
     },
       data() {
      return {
        showModal: true,
        isLoading: false,
        exemgtData: {
            bank_name: '',
            filename: '',
            version: '',
            description: '',
            fileList: [],
            user_id: this.$store.state.user.id
        },
        formData: new FormData()
      }
    },
 props: {
      uploadModal: {
        type: Boolean,
        default: false
      }
    },
    methods: {
  handleClose(done) {
        this.$confirm(this.$t('exemgt.close_notif'))
          .then(_ => {
            done();
          })
          .catch(_ => {});
      },
      handleSubmit(){
          this.isLoading = true
         for (var i in this.exemgtData){
             this.formData.append(i, this.exemgtData[i])
         }
          uploadExe(this.formData).then(res => {
              if(res.status === 0){
                  this.isLoading = false
                  this.showModal = false
                  this.$message.success(this.$t('exemgt.upload_success'))
              }
          })
      },
      handleChange(file, fileList){
          this.formData.append('file', file.raw);
      }
    }
 }
</script>
